<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>MobiTV CMS</title>
	<script type="text/javascript" src="/js/jquery.js"></script>
	<link type="text/css" rel="stylesheet" href="/themes/viettel-blue-3g/css/style.css" />

	<!--[if IE]><link rel="stylesheet" href="css/iefix.css" type="text/css"><![endif]-->

</head>
<body>
	<div id="wrapper">
		<div id="header" class="clear"><div class="in1"><div class="in2">
			<a id="logo" href="#" title="Home"></a>
            <div id="userbar">
                Xin chào <b class="user">admin</b> | 
                <a href="#">Trang cá nhân</a> | 
                <a href="#">Thoát</a>
            </div>
		</div></div></div>
		<ul id="mainmenu" class="clear">
			<li class="first"><a href="#">Trang chủ</a></li>
			<li class="active" id="mnu-video"><a href="#">Video</a>
				<ul class="submenu hidden">
					<li><a href="#">Lorem ipsum dolor </a></li>
					<li><a href="#">Lorem ipsum</a></li>
					<li class="last"><a href="#">Lorem ipsum</a></li>
				</ul>				
			</li>
			<li><a href="#">Kênh</a>
				<ul id="test" class="submenu hidden">
					<li><a href="#">Lorem ipsum dolor sit amet oladi olada</a></li>
					<li><a href="#">Lorem ipsum</a></li>
					<li class="last"><a href="#">Lorem ipsum</a></li>
				</ul>				
			</li>
			<li><a href="#">Thành viên</a>
				<ul class="submenu hidden">
					<li><a href="#">Lorem ipsum dolor sit amet oladi olada</a></li>
					<li><a href="#">Lorem ipsum</a></li>
					<li class="last"><a href="#">Lorem ipsum</a></li>
				</ul>				
			</li>
			<li><a href="#">Thống kê</a>
				<ul class="submenu hidden">
					<li><a href="#">Lorem ipsum dolor sit amet oladi olada</a></li>
					<li><a href="#">Lorem ipsum</a></li>
					<li class="last"><a href="#">Lorem ipsum</a></li>
				</ul>				
			</li>
			<li><a href="#">Hệ thống</a>
				<ul class="submenu hidden">
					<li><a href="#">Lorem ipsum dolor sit amet oladi olada</a></li>
					<li><a href="#">Lorem ipsum</a></li>
					<li class="last"><a href="#">Lorem ipsum</a></li>
				</ul>				
			</li>
			<li id="upload"><a href="#">UPLOAD</a></li>
			
		</ul>

		<div id="content">
			
			<div id="main-content" class="clear">
                <div id="sidebar">
					
					<ul class="nav">
						<li><a href="#">Menu Item 1</a></li>
						<li><a href="#">Menu Item 2</a></li>
						<li class="active last"><a href="#">Menu Item 3</a></li>
					</ul>
                    
                </div>
                <div id="main">
				
					<div class="msg-error">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, <a href="#">when an unknown</a> printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries,</div>
					<div class="msg-info">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a <a href="#">when an unknown</a> of type and scrambled it to make a type specimen book. It has survived not only five centuries,</div>
					<div class="tips">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and <a href="#">when an unknown</a> it to make a type specimen book. It has survived not only five centuries,</div>
					
					<h1>This is an heading 1</h1>
					Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and <a href="#">when an unknown</a> it to make a type specimen book. It has survived not only five centuries
					<h2>This is an heading 2</h2>
					Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and <a href="#">when an unknown</a> it to make a type specimen book. It has survived not only five centuries
					<h3>This is an heading 3</h3>
					Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and <a href="#">when an unknown</a> it to make a type specimen book. It has survived not only five centuries
					<h4>This is an heading 4</h4>
					Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and <a href="#">when an unknown</a> it to make a type specimen book. It has survived not only five centuries
					<h3 class="title">Datagrid</h3>
					<div class="inner">
						<div class="pad5-tb clear">
							<input type="button" class="button" value="Form button" />
							<a class="button" href="javascript:void(0)"><b>Link button</b></a>
							<a class="button" onclick="document.frmSubmit.submit();" href="javascript:void(0);" name="submit">
								<b>Link submit</b>
							</a>
						</div>
						<div class="list">
							<table class="datagrid" style="width:100%" cellspacing="1" cellpadding="0" border="0">
								<tr>
									<th style="width:5%"><input type="checkbox" name="check-all" /></th>
									<th>Collumn 1</th>
									<th>Collumn 2</th>
									<th>Collumn 3</th>
								</tr>
								<tr>
									<td><input type="checkbox" name="check-item" /></td>
									<td><a href="#">Title 1 Lorem ipsum</a></td>
									<td>abc</td>
									<td><a href="#" class="tbl-button"><b>button 1</b></a><a href="#" class="tbl-button"><b>button 2</b></a></td>
								</tr>
								<tr class="odd">
									<td><input type="checkbox" name="check-item" /></td>
									<td><a href="#">Title 1 Lorem ipsum</a></td>
									<td>abc</td>
									<td>
										<a href="#" class="tbl-button"><b>button 1</b></a>
										<a href="#" class="tbl-button"><b>button 2</b></a>
									</td>
								</tr>
								<tr>
									<td><input type="checkbox" name="check-item" /></td>
									<td><a href="#">Title 1 Lorem ipsum</a></td>
									<td>abc</td>
									<td>
										<a href="#" class="tbl-button"><b>button 1</b></a>
										<a href="#" class="tbl-button"><b>button 2</b></a>
									</td>
								</tr>
								<tr class="actionbar">
									<td colspan="4">
										<input type="button" class="button" value="Form button" />
										<a class="button" href="javascript:void(0)"><b>Link button</b></a>
										<a class="button" onclick="document.frmSubmit.submit();" href="javascript:void(0);" name="submit2">
											<b>Link submit</b>
										</a>
									</td>
								</tr>
							</table>
							<div class="pad5-tb paging-bar">
								<ul>
									<li><a href="#">« Trước</a></li>
									<li><a href="#">2</a></li>
									<li class="active"><span>3</span></li>
									<li><a href="#">4</a></li>
									<li><span>...</span></li>
									<li><a href="#">100</a></li>
									<li><a href="#">Sau »</a></li>
								</ul>
							</div>
						</div>
						<br/>
						<h3>Fieldset title - Personal</h3>
						<div class="frm">
							<dl class="clear">
								<dt>Field name</dt>
								<dd><input type="text" class="textbox" name="fieldname" value="" style="width:200px" /></dd>
							</dl>
							<dl class="clear">
								<dt>Field name</dt>
								<dd><input type="text" class="textbox focus" name="fieldname" value="" style="width:200px" /></dd>
							</dl>
							<dl class="clear">
								<dt>Field name</dt>
								<dd>
									<select name="combobox" class="selectbox">
										<option>Select value</option>
										<option>Option 1</option>
										<option>Option 2</option>
										<option>Option 3</option>
									</select>
								</dd>
							</dl>
							<dl class="clear">
								<dt>&nbsp;</dt>
								<dd><a class="button" onclick="document.frmSubmit.submit();" href="javascript:void(0);">
								<b>Update</b>
							</a></dd>
							</dl>
						</div>
					</div>
				</div>
			</div>
		</div>
		
		<div id="footer"><div class="in1"><div class="in2">
			Copyright &copy; 2009 by Viettel
		</div></div></div>
	</div>
<script type="text/javascript">

function initMenu(menu) {
	/* Sub-menu level 1	*/
	menu.find('.submenu').hover( //control parent behaviour
		function(){$(this).parent().find('> a').addClass('hover');},
		function(){$(this).parent().find('> a').removeClass('hover');}
	)
	.parent().hover( //control submenu behaviour
		function(){$(this).find('.submenu').removeClass('hidden');},
		function(){$(this).find('.submenu').addClass('hidden');}
	);
	
	/* Sub-menu level 2 */
	menu.find('.submenu2').hover( //control parent behaviour
		function(){$(this).parent().find('> a').addClass('hover');},
		function(){$(this).parent().find('> a').removeClass('hover');}
	)
	.parent().hover( //control submenu behaviour
		function(){$(this).find('.submenu2').removeClass('hidden');},
		function(){$(this).find('.submenu2').addClass('hidden');}
	);
}

initMenu($('#mainmenu'));

$('a.button')
	.mousedown(function(){$(this).addClass('button_click')})
	.mouseup(function(){$(this).removeClass('button_click')});

	
</script>
</body>
</html>